﻿<%@ Page Title="Vendor Management" Language="C#" MasterPageFile="~/Lab.master" AutoEventWireup="true" CodeFile="VendorManagement.aspx.cs" Inherits="VendorManagement" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="BodyContent" runat="Server">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>Daftar Vendor Barang</h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#">Settings 1</a>
                            </li>
                            <li><a href="#">Settings 2</a>
                            </li>
                        </ul>
                    </li>
                    <li><a class="close-link"><i class="fa fa-close"></i></a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>

            <div class="x_content">
                <div class="table-responsive">
                    <asp:Repeater ID="userList" runat="server">
                        <HeaderTemplate>
                            <table class="table table-striped jambo_table bulk_action" id="tblEditable">
                                <thead>
                                    <tr class="headings">
                                        <th class="column-title">ID</th>
                                        <th class="column-title">Nama Vendor</th>
                                        <th class="column-title">Alamat</th>
                                        <th class="column-title">Kontak Person</th>
                                        <th class="column-title">Telepon</th>
                                        <th class="column-title">Keterangan</th>
                                    </tr>
                                </thead>
                                <tbody>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <tr class="even pointer">
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "ID") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "NAMA_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "ALAMAT_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "KONTAK_PERSON") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "TELEPON_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "KETERANGAN") %></td>
                            </tr>
                        </ItemTemplate>
                        <AlternatingItemTemplate>
                            <tr class="odd pointer">
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "ID") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "NAMA_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "ALAMAT_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "KONTAK_PERSON") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "TELEPON_VENDOR") %></td>
                                <td class=" "><%# DataBinder.Eval(Container.DataItem, "KETERANGAN") %></td>
                            </tr>
                        </AlternatingItemTemplate>
                        <FooterTemplate>
                            </tbody>
                                    </table>
                        </FooterTemplate>
                    </asp:Repeater>
                </div>
            </div>
        </div>

        <div class="x_panel">
            <div class="x_title">
                <h2>Tambah Vendor</h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#">Settings 1</a>
                            </li>
                            <li><a href="#">Settings 2</a>
                            </li>
                        </ul>
                    </li>
                    <li><a class="close-link"><i class="fa fa-close"></i></a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                <br />
                <form id="myForm" runat="server" class="form-horizontal form-label-left" method="post">
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Nama<span class="required">*</span></label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input id="nama" runat="server" class="form-control col-md-7 col-xs-12" type="text" name="nama" required >
                        </div>
                    </div>
                    
                    
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Alamat<span class="required">*</span></label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input id="alamat" runat="server" class="form-control col-md-7 col-xs-12" type="text" name="alamat" required >
                        </div>
                    </div>
                    
                    
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Kontak Person<span class="required">*</span></label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input id="kontak" runat="server" class="form-control col-md-7 col-xs-12" type="text" name="kontak" required >
                        </div>
                    </div>
                    
                    
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Telepon<span class="required">*</span></label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input id="telepon" runat="server" class="form-control col-md-7 col-xs-12" type="text" name="telepon" required >
                        </div>
                    </div>
                    
                    
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Keterangan</label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <textarea id="keterangan" runat="server" class="form-control col-md-7 col-xs-12" rows="5" name="keterangan"></textarea>
                        </div>
                    </div>

                    <%--<div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">User Entry<span class="required">*</span></label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input style="visibility:hidden" id="user" class="form-control col-md-7 col-xs-12" type="text" name="user" required value="2"/>
                        </div>
                    </div>--%>
                            <input style="visibility:collapse" runat="server" id="user" class="form-control col-md-7 col-xs-12" type="text" name="user" required value="2"/>
                                                

                    <div class="form-group">
                        <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
                            <asp:Button runat="server" ID="btnAdd" OnClick="btnAdd_Click" CssClass="btn btn-success" Text="Tambah Vendor" />
                            <%--<button id="myButton" class="btn btn-success">Tambah Vendor</button>--%>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="BodyFooterContainer" runat="Server">
    <script type="text/javascript">
        $('#tblEditable').Tabledit({
            url: 'DataManagement.aspx?ManageVendor',
            deleteButton: true,
            saveButton: true,
            autoFocus: false,
            restoreButton: false,
            hideIdentifier: true,
            columns: {
                identifier: [0, 'id'],
                editable: [[1, 'nama'], [2, 'alamat'], [3, 'kontak'], [4, 'telepon'], [5, 'keterangan'], ]
            },
            onDraw: function () {
                console.log('onDraw()');
            },
            onSuccess: function (data, textStatus, jqXHR) {
                new PNotify({
                    title: 'Edit Data Laboratorium Berhasil',
                    text: '',
                    type: 'success',
                    styling: 'bootstrap3'
                });
            },
            onFail: function (jqXHR, textStatus, errorThrown) {
                new PNotify({
                    title: 'Edit Data Laboratorium Gagal',
                    text: textStatus,
                    type: 'error',
                    styling: 'bootstrap3'
                });
            },
            onAlways: function () {
                console.log('onAlways()');
            },
            onAjax: function (action, serialize) {
                console.log('onAjax(action, serialize)');
                console.log(action);
                console.log(serialize);
            }
        });
    </script>

    <script type="text/javascript">   
        $("#myButton").on("click", function (e) {

            var $myForm = $('#myForm')
            if (!$myForm[0].checkValidity()) {
                $myForm.find(':submit').click();
                return;
            }

            e.preventDefault();
            var aData = [];
            var nama = $("#nama").val();
            var alamat = $("#alamat").val();
            var kontak = $("#kontak").val();
            var telepon = $("#telepon").val();
            var keterangan = $("#keterangan").val();
            var user = $("#user").val();
            var jsonData = JSON.stringify({ nama: nama, alamat: alamat, kontak: kontak, telepon: telepon, keterangan: keterangan, user: user });
            $.ajax({
                type: "POST",  
                url: "VendorManagement.aspx/TambahVendor",
                data: jsonData,
                contentType: "application/json; charset=utf-8",
                dataType: "json", // dataType is json format
                success: OnSuccess,
                error: OnErrorCall
            });

            function OnSuccess(response) {
                if (response.d.Status == true) {
                    new PNotify({
                        title: 'Penambahan Vendor Berhasil',
                        text: 'Data sudah berhasil ditambahkan',
                        type: 'success',
                        styling: 'bootstrap3'
                    });
                    $('#myForm').trigger("reset");
                    // generate tanda terima
                }
                else
                {
                    new PNotify({
                        title: 'Penambahan Vendor Gagal',
                        text: response.d.ErrorMessage,
                        type: 'error',
                        styling: 'bootstrap3'
                    });
                }
            }
            function OnErrorCall(response) {
                new PNotify({
                    title: 'Gagal Mengirim Data',
                    text: response.statusText + ' (' + response.status + ') : ' + response.responseJSON.Message,
                    type: 'error',
                    styling: 'bootstrap3'
                });
            }
        });
        //*
    </script>  
</asp:Content>

